<template>
  <div class="todo">
    <div class="todo-text">{{ b.text }}</div>
    <div v-if="b.isFinite">✅</div>
    <button v-else="" @click="fin(b.id)">完成</button>
    <button @click="del(b.id)">删除</button>
  </div>
</template>

<script setup>

import { useStore } from "../stores/userStore";

const todo = useStore();

const por = defineProps(['b']);


const fin = (id) => {
  // console.log(por.b.isFinite);
  todo.find(id)
};

const del = (id) => {
  todo.delete(id)
}

</script>
<script>
// export default {
//   props: ['b'],
//   methods: {
//     fin() {
//       this.b.isFinite = !this.b.isFinite
//     },
//     del() {

//     }
//   }
// }
</script>
<style scoped>
.todo {
  display: flex;
  flex-direction: row;
  border: 1px solid #eee;
  padding: 10px;
}

.todo-text {
  width: 200px;
}
</style>